import { useEffect, useMemo, useState } from "react";
import { useNavigate, useSearchParams } from "react-router-dom";
import http from "../../axios/api";
import { useSelector } from "react-redux";
import { Button, Card, Checkbox, List, NoticeBar, Toast } from "antd-mobile";
import dayjs from 'dayjs'
import Person from "../../components/Person";

function AllListDetial() {
    const [item, setItem] = useState({});
    const [searchParams] = useSearchParams();
    const id = searchParams.get("id");
    const [selectPerson, setSelectPerson] = useState([]);
    const navigate = useNavigate();

    const riderListSlice = useSelector((state) => state.riderListSlice);


    const getDetial = async () => {
        const res = await http.get("/api/order/list/detail", {
            params: { id },
        });
        const { code, data } = res.data;
        if (code == 200) {
            const random = Math.floor(Math.random() * 40) + 1;
            data.startTime = `2025-10-${random < 10 ? "0" + random : random}`;

            setItem(data);
        }
    };

    useEffect(() => {
        getDetial();
    }, []);

    const rider = useMemo(() => {
        return riderListSlice.filter((v) => v.status);
    }, [riderListSlice]);

    const deduct = () => {
        let ratio = 0;
        const targetTime = dayjs(item.startTime);
        const currentTime = dayjs();

        const diffDay = targetTime.diff(currentTime, "day", true);


        if (diffDay > 8) {
            ratio = 0
        }
        else if (diffDay > 2) {
            ratio = 0.05
        }
        else if (diffDay >= 1) {
            ratio = 0.1
        }
        else if (diffDay < 1 && diffDay > 0.5) {
            ratio = 0.2
        }
        else {
            ratio = 1
        }
        return ratio
    }


    const deductResult = deduct();

    const backTicket = () => {
        if (deductResult >= 1) {
            Toast.show('不能退票')
            return;
        }
        setTimeout(() => {
            Toast.show("退款成功，退回金额：" + ((item.price / rider.length * selectPerson.length) - (item.price / rider.length * selectPerson.length) * deductResult))
            const all_list = localStorage.getItem('all_list')
            if (all_list) {
                const all_list_data = JSON.parse(all_list);
                all_list_data.forEach(v => {
                    if (v.id == item.id) {
                        v.status = "已退票"
                    }
                })

                localStorage.setItem('all_list', JSON.stringify(all_list_data));
                navigate(-1);
            }
        }, 800)

    }

    return (
        <div>
            <div>
                <span>订单ID: </span>
                {item.id}
            </div>
            <div>
                <span>城市: </span>
                {item.start} - {item.end}
            </div>
            <div>
                <span>发车时间: {item.startTime}</span>
                <span>金额: {item.price}</span>
            </div>

            <Person selectPerson={selectPerson} rider={rider} setSelectPerson={setSelectPerson} />

            <Card>
                <div>退款总金额：{item.price / rider.length * selectPerson.length} </div>
                <div>扣除百分比：{deductResult} </div>
                <div>预计手续费：{deductResult >= 1 ? '不能退款' : (item.price / rider.length * selectPerson.length) * deductResult} </div>
            </Card>

            <Button disabled={deductResult >= 1} block color='primary' onClick={backTicket}>退票</Button>
        </div>
    );
}

export default AllListDetial;
